<template>
	<!-- 下拉框 -->
	<a-select v-model="childModel" :placeholder="placeholder" :disabled="disabled" style="min-width: 100px">
		<a-select-option v-for="item in options" :key="item.value" :value="item.value">{{ item.label }}</a-select-option>
	</a-select>
</template>

<script>
export default {
	name: 'zSelect',
	model: {},
	props: {
		// 当前组件绑定值
		model: {
			type: [String, Number],
			require: true,
		},
		// 输入框默认值
		placeholder: {
			type: String,
			default() {
				return '';
			},
		},
		// 是否禁用
		disabled: {
			type: Boolean,
			default() {
				return false;
			},
		},
		// 下拉框的值
		options: {
			type: Array,
			default() {
				return [];
			},
		},
	},
	data() {
		return {
			childModel: this.model,
		};
	},
	watch: {
		childModel(val) {
			this.$emit('update:model', val);
			// 重置操作时不触发验证
			if (!(val === null)) {
				this.handleChange();
			}
		},

		model(val) {
			this.childModel = val;
			this.$emit('update:model', val);
		},
	},
	methods: {
		emitModel(val) {
			this.$emit('update:model', val);
		},
		handleChange() {
			this.$parent.$parent.$parent.$parent.onFieldChange();
		},
	},
};
</script>

<style></style>
